<html>
<head>
<script src="../tma.js"></script>
<script id="shader-vs" type="x-shader/x-vertex">
    attribute vec3 aVertices;
    uniform mat4 uMVMatrix;
    uniform mat4 uPMatrix;
    varying vec3 position;
    void main() {
        gl_Position = uPMatrix * uMVMatrix * vec4(aVertices, 1.0);
        position = vec3(gl_Position.xy, gl_Position.z - 90.);
    }
</script>
<script id="shader-fs" type="x-shader/x-fragment">
precision mediump float;
uniform float elapsedTime;
varying vec3 position;

const vec4 on = vec4(1.);
const vec4 off = vec4(vec3(0.), 1.);

void main() {
  float stages = 7.;
  float stage = mod(elapsedTime * .6, stages);
  //stage = stages - 1.;
  if(stage < 1.) {
    float yr = mod(elapsedTime * 25., 100.) - 50.;
    float lr = 1. / abs(position.y - yr) * 2. * position.z * 0.2;
    float yg = mod(elapsedTime * 12., 100.) - 50.;
    float lg = 1. / abs(position.y - yg) * 1.3 * position.z * 0.3;
    float yb = mod(elapsedTime * 10., 100.) - 50.;
    float lb = 1. / abs(position.y - yb) * 3. * position.z * 0.14;
    float yc = mod(-elapsedTime * 17., 100.) - 50.;
    float lc = 1. / abs(position.y - yc) * 1.1 * position.z * 0.1;
    float ym = mod(-elapsedTime * 7., 100.) - 50.;
    float lm = 1. / abs(position.y - ym) * 1.7 * position.z * 0.13;
    float yy = mod(-elapsedTime * 21., 100.) - 50.;
    float ly = 1. / abs(position.y - yy) * 3.3 * position.z * 0.17;
    gl_FragColor = vec4(lr + lm + ly, lg + lc + ly, lb + lc + lm, 1.);
  } else if(stage < 2.) {
    float l = 0.1 * position.z * abs(sin(position.y / 50. + elapsedTime * 5.));
    gl_FragColor = vec4(l, l, l, 1.);
  } else if(stage < 3.) {
    float yr = sin(elapsedTime * 3. + position.x * 0.1) * 27.;
    float lr = 4. / abs(position.y - yr) * position.z;
    float yg = sin(elapsedTime * 2. + position.x * 0.3) * 23.;
    float lg = 2. / abs(position.y - yg) * position.z;
    float yb = sin(elapsedTime + position.x * 0.7) * 20.;
    float lb = 1. / abs(position.y - yb) * position.z;
    gl_FragColor = vec4(lr, lg, lb, 1.);
    } else if(stage < 4.) {
    if (mod(elapsedTime * 3. + position.x * 10., 2.) < 1.) {
      gl_FragColor = on;
    } else {
      gl_FragColor = off;
    }
  } else if(stage < 5.) {
    float s = elapsedTime * 10.;
    gl_FragColor = vec4(mod(s + position.x * 100., 1.),
                        mod(s + position.y * 370., 1.),
                        mod(s + position.z * 700., 1.),
                        1.);
  } else if(stage < 6.) {
    float r = sin(elapsedTime * 3. + position.x);
    float g = sin(elapsedTime * 7. + position.y);
    float b = sin(elapsedTime * 11. + position.z);
    float c = pow(sin(elapsedTime * 3. + position.x), 3.);
    float m = pow(sin(elapsedTime * 7. + position.x), 7.);
    float y = pow(sin(elapsedTime * 11. + position.x), 11.);
    gl_FragColor = vec4(r + m + y, g + c + y, b + c + m, 1.);
  } else if(stage < 7.) {
    float r1 = sin(elapsedTime * 3.);
    float g1 = sin(elapsedTime * 5.);
    float b1 = sin(elapsedTime * 7.);
    float rad = sin(elapsedTime * 11.) * 3.;
    float tx1 = cos(elapsedTime) * 10.0 * rad;
    float ty1 = sin(elapsedTime) * 10.0 * rad;
    float d21 =  pow(tx1 - position.x, 2.) + pow(ty1 - position.y, 2.);
    float l1 = 10. / sqrt(d21 * 10.);

    float r2 = sin(elapsedTime * 3. + 100.);
    float g2 = sin(elapsedTime * 5. + 100.);
    float b2 = sin(elapsedTime * 7. + 100.);
    float tx2 = cos(elapsedTime - 3000.) * 10.0 * rad;
    float ty2 = sin(elapsedTime- 3000.) * 10.0 * rad;
    float d22 =  pow(tx2 - position.x, 2.) + pow(ty2 - position.y, 2.);
    float l2 = 10. / sqrt(d22 * 10.);
    float tx3 = cos(elapsedTime - 6000.) * 10.0 * rad;
    float ty3 = sin(elapsedTime- 6000.) * 10.0 * rad;
    float d23 =  pow(tx3 - position.x, 2.) + pow(ty3 - position.y, 2.);
    float l3 = 10. / sqrt(d23 * 10.);

    float r3 = sin(elapsedTime * 3. + 300.);
    float g3 = sin(elapsedTime * 5. + 300.);
    float b3 = sin(elapsedTime * 7. + 300.);
    float tx4 = cos(elapsedTime - 6000.) * 10.0 * rad;
    float ty4 = sin(elapsedTime- 6000.) * 10.0 * rad;
    float d24 =  pow(tx4 - position.x, 2.) + pow(ty4 - position.y, 2.);
    float l4 = 10. / sqrt(d24 * 10.);
    float fr = l1 * r1 + l2 * r2 + l3 * r3;
    float fg = l1 * g1 + l2 * g2 + l3 * g3;
    float fb = l1 * b1 + l2 * b2 + l3 * b3;
    gl_FragColor = vec4(fr, fg, fb, 1.);
    /*
      float cx = 0.0;
      float cy = 0.0;
      float cz = 0.0;
      float scale = (2. + sin(elapsedTime * 7.)) * 20.;
      float px = position.x / scale;
      float py = position.y / scale;
      float pz = position.z / scale;
      float d2 = pow(cx - px, 2.) + pow(cy - py, 2.) + pow(cz - pz, 2.);
      float l = sin(d2 * d2);
      gl_FragColor = vec4(l, l, l, 1.);
    */
  }
}
</script>
<script>
tma.extlibs = [ 'ext/gl-matrix.js' ];
tma.onload = function () {
  var screen = new TmaScreen(TmaScreen.FULL_WIDTH,
                             TmaScreen.FULL_HEIGHT,
                             TmaScreen.MODE_3D);
    screen.attachTo(TmaScreen.BODY);

    // Initialize program with shaders.
    var program = screen.createProgram('shader-vs', 'shader-fs');

    // Initialize matrices.
    var pMatrix = mat4.create();
    var mvMatrix = mat4.create();
    mat4.perspective(45, screen.width / screen.height, 0.1, 500.0, pMatrix);
    mat4.identity(mvMatrix);
    program.setUniformMatrix('uPMatrix', pMatrix);

    var mvMatrixBase = mat4.create(mvMatrix);

    // Model data.
    var ply;
    var r = 0;

    // Load model data.
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'data/lpoly.ply');
    xhr.responseType = 'arraybuffer';
    xhr.onload = function () {
        ply = new TmaModelPly();
        ply.load(this.response);
        ply.scale(30.0);
        ply.items = ply.getVertices().length / 3;
        var vertices = screen.createBuffer(ply.getVertices());
        program.setAttributeArray('aVertices', vertices, 0, 3, 0);
        var indices = ply.getIndices();
        ply.indices = screen.createElementBuffer(indices);
        ply.indices.items = indices.length;
        setInterval(main, 15);
    };
    xhr.send();

    // Periodical rendering.
    function main () {
        // Draw
        mat4.set(mvMatrixBase, mvMatrix);
        mat4.translate(mvMatrix, [0.0, -30.0, -100.0]);
        mat4.rotate(mvMatrix, r, [0.0, 1.0, 0.0]);
        mat4.rotate(mvMatrix, -Math.PI / 2.0, [1.0, 0.0, 0.0]);
        program.setUniformMatrix('uMVMatrix', mvMatrix);

        var now = (Date.now() % 1000000000) / 1000.0;
        program.setUniformVector('elapsedTime', [ now ]);

        program.drawElements(Tma3DScreen.MODE_TRIANGLES, ply.indices, 0,
                ply.indices.items);
        r += 0.03;
    }
};
</script>
</head>
<body bgcolor='0'>
</body>
</html>
